<template>
    <div>
         <van-nav-bar
      title="我的跟帖"
      left-text="返回"
      left-arrow
      @click-left="$router.back()"
    />
    <div class="list">
        <div class="item" v-for="item in list" :key='item.id'>
             <div class="date">
            <span>{{item.create_date.split('T')[0]}}</span>
            <span>{{item.create_date.split('T')[1].slice(0,5)}}</span>
        </div>
        <div class="content">{{item.content}}</div>
        <div class="detail" @click="$router.push(`/detail/${item.post.id}`)">
          <p>{{item.post.title}}</p>
          <i class="iconfont iconjiantou1"></i>
        </div>
        </div>
    </div>
    </div>
</template>

<script>
import { getUserComment } from '@/api'
export default {
    data () {
        return {
            list:[]
        }
    },
    mounted(){
        getUserComment().then((res)=>{
            console.log(res);
            this.list=res.data.data
        })
    }
}
</script>
<style lang="less" scoped>
.list {
.item {
    padding: 10px;
     border-bottom: 2px solid #ccc;
  .date {
      font-size: 14px;
      color: #999;
      span {
        margin-right: 10px;
      }
    }

  .content {
         padding: 20px;
         color: #333;
    }

  .detail {
      font-size: 12px;
      color: #888;
      display: flex;
      align-items: center;

      p {
        padding-left: 20px;
        flex: 1;
        font-size: 12px;
        color: #999;
       overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      }
    }
  }
}
</style>